{{define "mobile/ordinary/feedback.html"}}
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
	<meta name="format-detection" content="telephone=no">
	<title>意见反馈</title>
	<link rel="stylesheet" type="text/css" href="/res/mobile/css/weui.css"/>
	<link rel="stylesheet" type="text/css" href="/res/mobile/css/example.css"/>
	<link rel="stylesheet" type="text/css" href="/res/mobile/css/bootstrap.min.css" />
	<style type="text/css">
		.weui-tabbar a:active span{
			color: #07C160 !important;
		}
		.weui-tabbar a:active p{
			color: #07C160 !important;
		}
		.weui-bar__item_on span {
			color: #07C160;
		}

		.weui-tabbar__item span {
			display: inline-block;
			width: 28px;
			height: 28px;
			margin-bottom: 2px;
		}
		.glyphicon {
			font-size: 18px !important;
		}
		.weui-grids a:focus, a:hover {
			color: #337ab7;
			text-decoration: none;
		}
		.weui-cells_form{
			margin: 10px;
			border-radius: 6px;
		}
		textarea::-webkit-input-placeholder { /* WebKit browsers */
			color: #999;
			font-size: 14px;
		}

		textarea::-moz-placeholder { /* Mozilla Firefox 19+ */
			color: #999;
			font-size: 14px;
		}

		textarea:-ms-input-placeholder { /* Internet Explorer 10+ */
			color: #999;
			font-size: 14px;
		}
		.weui-textarea{
			font-size: 14px !important;
			height: 10em;
			line-height: 1.5em;
			padding: 0px 5px;
		}
		.weui-textarea-counter{
			margin-top: .5em;
		}
		.button-sp-area{
			margin: 4em 24px;
		}
		.button-sp-area a{
			height: 2.8em;
			line-height: 2em;
			font-size: 1.3em;
		}
		.weui-toast{
			min-height: auto;
			height: 4em;
			line-height: 4em;
		}
		.disabled_{
			background: #ccc;
			color: #ddd;
		}
		.header{
			height: 50px;
			line-height: 50px;
			text-align: center;
			font-size: 16px;
		}
		.container{
			top:50px !important;
		}
	</style>
</head>
<body ontouchstart>
	<div  class="header">意见反馈</div>
	<div class="container" id="container">
		<div class="page tabbar js_show">
			<div class="page__bd" style="height: 100%;">
				<div class="weui-tab">
					<div class="weui-tab__panel">
						<div class="weui-cells weui-cells_form">
							<div class="weui-cell">
								<div class="weui-cell__bd">
									<textarea class="weui-textarea" placeholder="我们希望得到您的建议，反馈给我们，将不胜感激。" maxlength="200" rows="3"></textarea>
									<div class="weui-textarea-counter"><span>0</span>/200</div>
								</div>
							</div>
						</div>
						<div class="button-sp-area">
							<a onclick="onSubmit()" class="weui-btn weui-btn_block weui-btn_primary disabled_">提交</a>
						</div>
					</div>
					<!-- 导航start -->
					{{template "mobile/ordinary/tabbar.html"}}
					<!-- 导航end -->
				</div>
			</div>
			<!--BEGIN toast-->
			<div id="toast" style="display: none;">
				<div class="weui-mask_transparent"></div>
				<div class="weui-toast">
					<p class="weui-toast__content">提交成功</p>
				</div>
			</div>
			<!--end toast-->
		</div>
	</div>
	<script type="text/javascript" src="/res/mobile/js/zepto.min.js"></script>
	<script type="text/javascript" src="/res/mobile/js/jweixin-1.0.0.js"></script>
	<script type="text/javascript" src="/res/mobile/js/weui.min.js"></script>
	<!-- <script type="text/javascript" src="/res/mobile/js/example.js"></script> -->
	<script type="text/javascript" src="/res/mobile/js/jquery-3.2.1.min.js"></script>
	<script type="text/javascript" class="tabbar js_show">
		$(function(){
			$(".weui-tabbar").find("a:eq(3)").addClass('weui-bar__item_on').siblings('.weui-bar__item_on').removeClass('weui-bar__item_on');
			//
			$(".weui-textarea").on("input propertychange",function(){
				var lt = $.trim($(this).val()).length;
				if(lt>0){
					$(".button-sp-area").find("a").removeClass("disabled_");	
				}else{
					$(".button-sp-area").find("a").addClass("disabled_");
				}
				$(".weui-textarea-counter span").text(lt);
			})
		});
		//
		function onSubmit(){
			var content = $(".weui-textarea").val();
			if(content!=""&&content.length>0){
				$.post("/mobile/ordinary/saveFeedback",{textarea:content},function(r){
					if(r.code=="0"){
						$(".weui-textarea").val("");
						$(".button-sp-area").find("a").addClass("disabled_");
					}
					onToast(r.msg)
				})
			}else{
				onToast("提交失败")
			}
		}
		//
		function onToast(T) {
			$(".weui-toast__content").text(T);
			var $toast = $('#toast');
			if ($toast.css('display') != 'none') return;
			$toast.fadeIn(100);
			setTimeout(function () {
				$toast.fadeOut(100);
			}, 2000);
		}
	</script>

</body>
</html>
{{end}}